
import React, { Component, createRef } from "react";
import type { ReactNode } from 'react'

export default class App extends Component {

    state = {
        name: '张三'
    }


    // 1. 创建一个 ref 属性
    // inpRef = React.createRef<HTMLInputElement>()
    inpRef = createRef<HTMLInputElement>()

    render() {
        return <>
            <div>
                <h1>父组件 - {this.state.name}</h1>
                {/* 2. 设置 ref 属性，ref 相当于是一个 id 标识符 */}
                <input ref={this.inpRef} type="text" placeholder="请输入名称" />

                <button onClick={() => {
                    // 3. 通过 this.inpRef.current 获取到被标记的输入框
                    console.log(this.inpRef.current?.value);
                }}>点击获取内容</button>

            </div>
        </>
    }
}